<%--
  Created by IntelliJ IDEA.
  User: ASUS
  Date: 2021/10/7
  Time: 16:49
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>个人中心</title>
    <link href="${pageContext.request.contextPath}/css/index.css" rel="stylesheet">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/index-1.css">
    <link href="${pageContext.request.contextPath}/css/headermenu.css" rel="stylesheet">
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/image/title-img1.png">
    <link href="${pageContext.request.contextPath}/css/user.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath}/js/jquery-3.4.1.js"></script>
    <script src="${pageContext.request.contextPath}/js/ajaxfileupload.js"></script>


    <style>

        /* 头部导航的 */
        .global-header .login-page-header-nav li {
            float: left;
            margin-left: 30px;
        }

        .global-header .login-page-header-nav li i {
            margin-right: 10px;
            font-size: 28px;
            line-height: 1;
            color: #f6a206;
            vertical-align: middle;
        }

        .global-login-iconfont {
            font-family: "login-iconfont", serif;
            font-style: normal;
            font-weight: normal;
            cursor: default;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            *zoom: 1;
        }

        .global-header .login-page-header-nav li span {
            font-size: 14px;
            line-height: 28px;
            color: #666;
            vertical-align: middle;
        }

        .myimg {
            width: 100px;
        }
        input{
            border: none;
        }
    </style>
</head>

<body>
<header id="J-global-header" class="global-header">
    <div class="top-inner">
        <div id="sitenav" class="global-header-top-nav fn-clear">
            <div class="global-header-top-nav-right">
                <li class="top-nav-menu top-nav-menu-user-info" data-role="user-info" data-test="test">
                    <div class="top-nav-menu-handle">
                        <div class="login">
                            <%--                            <a href="${pageContext.request.contextPath}/login.jsp" class="J-login-btn" rel="nofollow" target="_self">登录/注册</a></div>--%>
                            <c:if test="${empty ServiceResponse}">
                                <a href="${pageContext.request.contextPath}/customer/login.jsp">登录/注册</a>
                            </c:if>

                            <c:if test="${!empty ServiceResponse}">
                                欢迎${ServiceResponse.data.custTelno}
                                <a href="${pageContext.request.contextPath}/logout">退出</a>
                            </c:if>
                        </div>
                    </div>
                </li>

                <li class="top-nav-menu top-nav-multi-menu top-nav-dl-app">
                    <div class="top-nav-menu-handle">
                        <i class="global-header-icon top-nav-dl-app-icon"></i>手机版
                    </div>
                    <div class="top-nav-menu-body top-nav-menu-qrcode">
                        <div class="top-nav-menu-bd-panel">
                            <div class="qrcode-img"></div>
                            <p>下载APP 领99元租车红包

                            </p>
                        </div>
                    </div>
                </li>

                <li class="top-nav-pipe">|</li>

                <li class="top-nav-menu top-nav-multi-menu top-nav-wx-guide">
                    <div class="top-nav-menu-handle"><i class="global-header-icon top-nav-wx-guide-icon"></i>微信</div>
                    <div class="top-nav-menu-body top-nav-menu-qrcode">
                        <div class="top-nav-menu-bd-panel">
                            <div class="qrcode-img"></div>
                            <p>扫一扫，关注微信</p>
                        </div>
                    </div>
                </li>
                <li class="top-nav-menu top-nav-multi-menu top-nav-order-lookup">
                    <div class="top-nav-menu-handle">订单查询<i class="top-nav-arrow"><em></em><span></span></i></div>
                    <div class="top-nav-menu-body top-nav-menu-list">
                        <div class="top-nav-menu-bd-panel">
                            <a href="${pageContext.request.contextPath}/center/myorder.jsp">订单查询</a>
                        </div>
                    </div>
                </li>
                <li class="top-nav-menu top-nav-multi-menu top-nav-order-lookup">
                    <div class="top-nav-menu-handle">个人中心<i class="top-nav-arrow"><em></em><span></span></i></div>
                    <div class="top-nav-menu-body top-nav-menu-list">
                        <div class="top-nav-menu-bd-panel">
                            <a href="${pageContext.request.contextPath}/center/user.jsp">进入个人中心</a>
                        </div>
                    </div>
                </li>
                <li class="top-nav-pipe">|</li>

            </div>

            <div class="global-header-top-nav-left">
                <div class="top-nav-menu top-nav-multi-menu top-nav-contact">
                    <div class="top-nav-menu-handle">
                        24小时客服！内地热线：110-120
                        <i class="top-nav-arrow"><em></em><span></span></i>
                    </div>
                    <div class="top-nav-menu-body top-nav-menu-list">
                        <div class="top-nav-menu-bd-panel">
                            <ul>
                                <li>
                                    <span class="title">中国内地热线</span>
                                    <a href="tel:10101020" target="_self" class="tel-number">110-120</a>
                                </li>
                            </ul>
                            <div class="top-nav-menu-bd-code">
                                <div class="qrcode-img"></div>
                                <p class="title">关注微信公众号</p>
                                <p class="text">可查询/修改/取消订单</p>
                                <a class="J-show-robot" href="javascript:" target="_self"
                                   data-tj="/公用头部/在线客服">24小时在线客服</a>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="toolbar fn-clear">
        <div id="slog" class="logo fn-left">
            <a class="sbx-logo" title="思必行-租车" target="_self" href="">

            </a>
        </div>
        <div class="toolbar-site-header-nav">
            <!--自定义一级菜单-->
            <ul class="login-page-header-nav fn-clear">
                <li><i class="global-login-iconfont">&#xe909;</i><span>有驾照就能租</span></li>
                <li><i class="global-login-iconfont">&#xe906;</i><span>地图导航</span></li>
                <li><i class="global-login-iconfont">&#xe908;</i><span>24小时服务在线</span></li>
            </ul>

            <!--系统默认-->
        </div>

    </div>
    <!--自定义二级菜单-->
</header>

<!--nav 导航-->
<div class="nav">
    <ul class="nav-wrap clear_float" id="J_NavBox">
        <li class="menu-index menu-index-on">
            <a href="${pageContext.request.contextPath}/index.jsp" target="_blank">首页</a>
            <span></span>
        </li>
        <li>
            <a href="${pageContext.request.contextPath}/selfrental/person_rentalcar.jsp" target="_blank">自驾租车</a>
            <span></span>
        </li>
        <li class>
            <a href="${pageContext.request.contextPath}/car/car.jsp" target="_blank">车型查询</a>
            <span></span>
        </li>
        <li>
            <a href="${pageContext.request.contextPath}/memberrent/members.jsp" target="_blank">会员租车</a>
            <span></span>
        </li>
        <li>
            <a href="${pageContext.request.contextPath}/store/store.jsp" target="_blank">营业网点</a>
            <span></span>
        </li>
        <li>
            <a href="${pageContext.request.contextPath}/memberrent/wonderful_activity.jsp" target="_blank">精彩活动</a>
            <span></span>
        </li>


    </ul>

</div>

<!-- crumbs -->
<div id="crumbs">
    <div class="crumbs-bd">
        当前位置：
        <a href="">个人中心</a> &gt;
        用户信息
    </div>
</div>

<div id="content">
    <div class="content-bd">
        <!--站点导航 右-->
        <div class="col-main">

            <%--<link rel="stylesheet" href="${pageContext.request.contextPath}/js/">--%>

            <div class="information">
                <h2>用户信息</h2>
                <div class="mod information-index">
                    <div class="ui-bfc information-index-panel">
                        <div class="ui-bfc-hd hd preImg" id="imagess">
                            <img src="${pageContext.request.contextPath}/image/bg_user_photo.png">
                        </div>
                        <form method="post" enctype="multipart/form-data" class="imageForm">
                            <%--                            <button class = "myimage" onclick = "clp();" style="background-color: #f8f8f8;color: #9a9a9a;border: 1px solid #9a9a9a;border-radius: 3px">更换头像</button>--%>
                            <input type="file" name="myimage" class="myimage" id="myimage" value="更换头像"
                                   style="color: transparent;width: 70px">
                            <input type="button" value="确定" class="submitBtn"
                                   style="border: none;font-size: 15px;background-color: #fff;color: #23b7b7;margin-left: 6px">
                        </form>
<%--                        <form class="ui-bfc-bd bd">--%>
<%--                            姓名：   <input type="text" name="shopName" /><br/>--%>
<%--                            性别：  <input type="text" name="shopBranchName" /><br/>--%>
<%--                            住址：<input type="text" name="shopAddrProvince"/><br/>--%>
<%--                            证件类型：<input type="text" name="shopAddrCity"/><br/>--%>
<%--                            证件号码：<input type="text" name="shopAddrArea"/><br/>--%>
<%--                            生日：<input type="text" name="shopAddrDetail"/><br/>--%>
<%--                            驾驶证认证：<input type="text" name="shopScore"/><br/>--%>
<%--                            开始时间:<input type="text" name="shopTelno"/><br/>--%>
<%--                            结束时间：<input type="text" name="shopPersonConsume"/><br/>--%>
<%--                        </form>--%>
                        <form class="ui-bfc-bd bd" method="post">
                            <table style="padding-left: 20px">
                                <tbody>
                                <tr>
                                    <td class="cell-title">姓名：</td>
                                    <td>
                                        <input id="driverName" type="text" name="driverName" />
                                    </td>
                                </tr>
                                <tr>
                                    <td class="cell-title">性别：</td>
                                    <td>
                                        <input id="driverSex" type="text" name="driverSex" />
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2">
                                        <div class="dashed-border"></div>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="cell-title">住址：</td>
                                    <td><input id="driverAddress" type="text" name="driverAddress" /></td>
                                </tr>
                                <tr>
                                    <td class="cell-title">证件类型：</td>
                                    <td><input id="driverType" type="text" name="driverType" /></td>
                                </tr>
                                <tr>
                                    <td class="cell-title">证件号码：</td>
                                    <td>
                                        <input id="driverNum" type="text" name="driverNum" />
                                    </td>

                                </tr>
                                <tr>
                                    <td class="cell-title">生日：</td>
                                    <td><input id="BirthdayTd" type="text" name="BirthdayTd" /></td>
                                </tr>
                                <tr>
                                    <td colspan="2">
                                        <div class="dashed-border"></div>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                            <div class="ui-bfc-jz">
                            <table width="100%">
                                <tbody>
                                <tr>
                                    <td class="cell-title">驾驶证认证：</td>
                                    <td class="appCode">
<%--                                        <p class="appCode_show" style="width: 100px">未上传</p>--%>
                                        <input type="file" name="carimage" class="carimage" id="carimage">
                                        <input type="button" value="上传" data-value="2" class="submitBtn1"
                                               accept="image/jpg,image/jpeg,image/gif,image/png"
                                               style="border: none;font-size: 15px;background-color: #fff;color: #23b7b7;margin-left: 6px;width: 50px">
                                    </td>
                                </tr>
                                <tr>
                                    <td class="cell-title">开始时间：</td>
                                    <td>
                                        <input type="text" id="driverStartTime" name="driverStartTime" />
                                    </td>
                                </tr>
                                <tr>
                                    <td class="cell-title">结束时间：</td>
                                    <td>
                                        <input type="text" id="driverEndTime" name="driverEndTime" />
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
<%--                        <div class="update">--%>
<%--                            <form method="get" action="">--%>
<%--&lt;%&ndash;                            <form method="post" action="${pageContext.request.contextPath}/user">&ndash;%&gt;--%>
<%--                                <input type="hidden" name="custId" value="${ServiceResponse.data.custId}">--%>
<%--                                <input type="hidden" name="custTelno" value="${ServiceResponse.data.custTelno}">--%>
<%--                                <input type="hidden" name="custPassword" value="${ServiceResponse.data.custPassword}">--%>
<%--                                <input type="hidden" name="custName" class="custName">--%>
<%--                                <input type="hidden" name="" value="">--%>
<%--                                <input type="hidden" name="" value="">--%>
<%--                                <input type="hidden" name="" value="">--%>
<%--                                <input type="hidden" name="" value="">--%>
<%--                                <input type="hidden" name="" value="">--%>
<%--                                <input type="hidden" name="" value="">--%>
<%--                                <input type="hidden" name="" value="">--%>
<%--                                <input type="submit" value="确认" class="saveBtn" style="margin-left: 200px;width: 100px">--%>
<%--                            </form>--%>
<%--                        </div>--%>
                        </form>
                    </div>
                </div>
            </div>

        </div>

        <!--站点导航 左-->
        <div class="col-sub">
            <dl class="sub-nav">
                <dt>我的订单</dt>
                <dd>
                    <a class="" href="myorder.jsp">订单管理</a>
                </dd>
                <dt>我的资产</dt>
                <dd>
                    <a class="" href="">账户余额</a>
                </dd>
                <dd>
                    <a class="" href="mycoupons.jsp">我的优惠券</a>
                </dd>
                <dt>个人中心</dt>
                <dd>
                    <a class="" href="user.jsp">用户信息</a>
                </dd>
                <dd>
                    <a class="" href="">常用租车人</a>
                </dd>
                <dd>
                    <a class=" ck" href="myreceiptaddress.jsp">常用收件信息</a>
                </dd>
                <dd>
                    <a class=" ck" href="favorite.jsp">我的收藏</a>
                </dd>
                <dd>
                    <a class="" href="">申请注销账户</a>
                </dd>
            </dl>
        </div>
    </div>
</div>


<%--<div class="preImg" style="display: none"></div>--%>
<script>
    // function clp(){
    //     return $("#myimage").click();
    // };
    var custId = "${ServiceResponse.data.custId}"
    var url = ' ${pageContext.request.contextPath}/center/user/'+custId;
    console.log(url);
    $.get(url,
        {
            custId:custId
        },
        function (result){
            console.log(JSON.stringify(result))
            var name = result.data.custName;//姓名
            var num = result.data.other1;//证件号
            var birth_date = result.data.driverBir;//生日
            var sex = result.data.custGender;//性别
            var vehicle_type = result.data.driverBirth;//准驾车型
            var start_date = result.data.starttime;//有效期开始时间
            var end_date = result.data.endtime;//有效期结束时间
            var issue_organization = result.data.driverAdd;

            console.log(name)
            if (sex=="F")
                sex = "女"
            if (sex=="M")
                sex = "男"
            $("#driverName").val(name);
            $("#driverSex").val(sex);
            $("#driverAddress").val(issue_organization);
            $("#driverType").val(vehicle_type);
            $("#driverNum").val(num);
            $("#BirthdayTd").val(birth_date);
            $("#driverStartTime").val(start_date);
            $("#driverEndTime").val(end_date);

        },"json");

    $(".submitBtn").click(function () {
        var url = "${pageContext.request.contextPath}/uploadSingleFileAjax";
        var myimage = $(".imageForm").serialize();

        $.ajaxFileUpload({
            url: url,
            dataType: "application/json",
            secureuri: false,//是否启用安全机制
            fileElementId: 'myimage',
            success: function (result) {
                // console.log("result:" + result);
                console.log("result:" + JSON.stringify(result));
                var imgpath = "${pageContext.request.contextPath}" + "//" + result;

                $(".preImg").show();
                $(".preImg").html("");
                var imgEle = ' <img src="' + imgpath + ' " width="114px" height="114px">';
                $(".preImg").append(imgEle);
            }
        })
    });
    $(".submitBtn1").click(function () {
        // $(".ui-bfc-bd").html("");
        var url = "${pageContext.request.contextPath}/uploadSingleFileAjax/car";

        $.ajaxFileUpload({
            url: url,
            dataType: "application/json",
            secureuri: false,//是否启用安全机制
            fileElementId: 'carimage',
            success: function (result) {
                // console.log("result:"+result);
                console.log("result:" + JSON.stringify(result)); //js --> json  结果：{"code":200,"data":20,"reason":"OK"}

                result = $.parseJSON(result.replace(/<.*?>/ig, ""));
                var name = result.data.name;//姓名
                var num = result.data.num;//身份证号
                var birth_date = result.data.birth_date;//生日
                var sex = result.data.sex;//性别
                var vehicle_type = result.data.vehicle_type;//准驾车型
                var issue_date = result.data.issue_date;//初次领证时间
                var start_date = result.data.start_date;//有效期开始时间
                var end_date = result.data.end_date;//有效期结束时间
                var issue_organization = result.data.addr;
                var imgs = document.getElementById("imagess").getElementsByTagName("img");
                console.log("姓名是:" + name);
                console.log("性别是" + sex);
                console.log("类型是" + vehicle_type);
                console.log("开始时间" + start_date);
                console.log("结束时间是" + result.data.end_date);
                console.log("驾驶证号" + result.data.num);

                // $(".ui-bfc-bd").html("");
                $("#driverName").val(name);
                $("#driverSex").val(sex);
                $("#driverAddress").val(issue_organization);
                $("#driverType").val(vehicle_type);
                $("#driverNum").val(num);
                $("#BirthdayTd").val(birth_date);
                $("#driverStartTime").val(start_date);
                $("#driverEndTime").val(end_date);

                $(".appCode").html("");
                $(".appCode").append("已上传");
                <%--var custId1 = ${ServiceResponse.data.custId};--%>
                <%--console.log("custid1:" + custId1);--%>
                <%--var custTelno = ${ServiceResponse.data.custTelno};--%>
                <%--console.log(custTelno);--%>
                if (sex=="女")
                    sex = "F"
                if (sex=="男")
                    sex = "M"
                var formEle = '<form method="get" action="${pageContext.request.contextPath}/user">\n' +
                    '    <input type="hidden" name="custId" value="${ServiceResponse.data.custId}">\n'+
                    '<input type="hidden" name="custTelno" value="${ServiceResponse.data.custTelno}">\n' +
                    '<input type="hidden" name="custPassword" value="${ServiceResponse.data.custPassword}">\n' +
                    '<input type="hidden" name="custGender" value="'+sex+'">\n' +
                    '<input type="hidden" name="driverAdd" value="'+issue_organization+'">\n' +
                    '<input type="hidden" name="driverBirth" value="'+vehicle_type+'">\n' +
                    '<input type="hidden" name="other1" value="'+num+'">\n' +
                    '<input type="hidden" name="driverBir" value="'+birth_date+'">\n' +
                    '<input type="hidden" name="starttime" value="'+start_date+'">\n' +
                    '<input type="hidden" name="headImg" value="'+imgs+'">\n' +
                    '<input type="hidden" name="endtime" value="'+end_date+'">\n'+
                    '    <input type="hidden" name="custName" value="'+name+'">\n' +
                    '    <input type="submit" value="确认" class="saveBtn" style="margin-left: 200px;width: 100px">\n' +
                    '</form>';
                <%--var formEle = '<form method="post" action="${pageContext.request.contextPath}/user">'+'<input type="hidden" name="driverName" value="'+name+'">'+'<input type="button" value="确认" class="saveBtn" style="margin-left: 200px;width: 100px">'+'</form>'--%>
                $(".bd").append(formEle);

              /*  $(".saveBtn").click(function (){
                    //2.获得表单中所有数据
                    var formData = $(".bd").serialize();
                    console.log("表单的数据："+formData);

                })*/

            }
        })
    });
    // $(".update .saveBtn").click(function (){
    //     $(".custName").val($("#driverName").val());
    //     console.log($(".custName").val())
    // })
</script>
</body>
</html>
